<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>添加拍品</title>
    <script th:src="@{/common/js/jquery.min.js}" type="text/javascript"></script>
    <script th:src="@{/common/layui/layui.js}" type="text/javascript"></script>
    <script th:src="@{/common/layui/layui.all.js}" type="text/javascript"></script>
    <script th:src="@{/common/js/userServer.js}" type="text/javascript"></script>
    <link rel="stylesheet" th:href="@{/common/layui/css/layui.css}">
    <style>
        .typeSelect {
            height: 38px;
            line-height: 1.3;
            border-width: 1px;
            border-style: solid;
            border-color: #e6e6e6;
            background-color: #fff;
            border-radius: 2px;
            width: 85%;
            padding-left: 10px;
            color: #666;
        }

        .layui-form-label {
            width: 100px;
        }

        .layui-input {
            width: 85%;
        }
    </style>
</head>
<body class="layui-layout-body"  >
<div id="scroll" style="overflow-y: auto;">
    <div id="maincontent" style="width:94%;"  >
        <form class="layui-form" action="">
            <!-- 内容主体区域  表单内容 -->   
            <div class="layui-form-item">
                <label class="layui-form-label">拍品名称</label>
                <div class="layui-input-block">
                    <input class="layui-input"  type="text"
                           id="title" name="title" lay-verity="required"
                           autocomplete="off" placeholder="请输入拍品名称"
                    />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">拍品描述</label>
                <div class="layui-input-block">
            <textarea name="descript" id="descript" placeholder="请输入10~100字的描述：" class="layui-textarea"
                      style="width: 85%;"></textarea>
                </div>
            </div>
            <div class="layui-row">
                <div class="layui-col-md3">
                    <label class="layui-form-label">起拍价格：</label>
                    <div class="layui-input-inline">
                        <input type="number" class="layui-input" placeholder="0.0" id="price">
                    </div>
                </div>
                <div class="layui-col-md3">
                    <label class="layui-form-label">数量：</label>
                    <div class="layui-input-inline">
                        <input type="number" class="layui-input" placeholder="0" id="cou">
                    </div>
                </div>
            </div>
            <div class="layui-form-item" style="margin-top: 12px">
                <label class="layui-form-label">起拍日期范围</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" placeholder=" - " id="start">
                </div>
            </div>
            <div class="layui-form-item" style="margin-top: 10px">
                <label class="layui-form-label">拍品类别</label>
                <div class="layui-input-block">
                    <select name="stype" lay-verify="required" style="display: inline;" class="typeSelect" id="stype">
                        <option value="">请选择拍品所属类别</option>
                        <div th:each="sType:${sType}">
                            <option th:value="${sType.tid}">[[${sType.tname}]]</option>
                        </div>
                    </select>
                </div>
            </div> 
            <div class="layui-row" >
                <label class="layui-form-label">图片上传</label>
                <div class="layui-input-block">
                               
                    <button type="button" class="layui-btn" id="test1">
                                        <i class="layui-icon">&#xe67c;</i>选择图片（最多选择5张，单张图片最大为10M）
                                   
                    </button>
                               
                    <button type="button" class="layui-btn" id="test9">开始上传</button>
                               
                    <button type="button" class="layui-btn" id="cleanImgs"><i class="fa fa-trash-o fa-lg"></i>清空图片预览</button>
                           
                </div>
                       
                <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px; height: 160px;">
                                预览图：    
                    <div class="layui-upload-list" id="demo2"></div>
                           
                </blockquote>
                   
            </div>
                
                <input type="text" id="imgUrls" name="imgUrls" style="display: none;" class="layui-input">
               
            <div class="layui-form-item" style="height: 70px">
                       
                <div class="layui-input-block">
                               
                    <button class="layui-btn" type="button" style="width: 800px;" id="btnSubmit">添加拍品</button>
                           
                </div>
                   
            </div>
            <!--[[${sType}]]-->
        </form>
    </div>
</div>
<script th:src="@{/js/goodsMutiUpload.js}" type="text/javascript"></script>
<script>
    //JavaScript代码区域
    layui.use('laydate', function () {
        var laydate = layui.laydate;

        //日期时间范围
        laydate.render({
            elem: '#start'
            , type: 'datetime'
            , range: true
            ,trigger: 'click'
        });
    });
    $(window).load(function () {
        changeDivHeight();
    });
    $(window).resize(function () {
        changeDivHeight();
    });
    //当浏览器窗口大小改变时，设置显示内容的高度
    window.οnresize=function(){
        alert(1);
        changeDivHeight();
    }
    function changeDivHeight() {
        var h = document.documentElement.clientHeight;//获取页面可见高度
        $("#scroll").height(h + "px");
        $("#mainContent").height(h - 20 + "px");
    }
</script>
</body>
</html>